<template>
  <div class="demo-image">
    <el-image fit="fill" :src="productInformation.src" @click="handleClick(productInformation.url)"></el-image>
    <p>{{ productInformation.productName }}</p>
    <p class="price">{{ productInformation.price }}</p>
  </div>
</template>

<script>
export default {
  name: "ProductImageInformation",
  props:["productInformation"],
  created() {
  },
  methods:{
    handleClick(id){
      this.$router.push(id)
    }
  }
}
</script>

<style scoped>

.el-image{
  width: 150px;
  height: 150px;
  padding: 0 20px;
  border-right: 2px solid #f5f0f0;
}
p{
  font-size: 12px;
}
.price{
  font-weight: bolder;
  color: rgb(223, 49, 51);
  font-size: 14px;
}
</style>